<template>
<div class="module-basic-opiniontemplate">
  <el-row style="height:100%;">
    <el-col style="height:100%;">
      <table-panel :name="'意见模板信息'" :columns="opinionTemplateColumns" :tableData="opinionTemplateData" :showRowNumber="true" :multiSelection="true"
      :usePagination="false"
      :canCreate="authorities.create" :canEdit="authorities.edit" :canDelete="authorities.delete"
      :currentPage="opinionTemplateCurrentPage" :totalNum="opinionTemplateTotalNum" @page-change="onPageChange('opinionTemplate',$event)" :pageSize="pageSize"
      @table-searching="onSearching('opinionTemplate',$event)"
      @table-create="onCreate('opinionTemplate',$event)" @table-edit="onEdit('opinionTemplate', $event)"
      @table-delete="onDelete('opinionTemplate',$event)" @table-export="onExport('opinionTemplate',$event)"
      @selection-change="onSelectionChange('opinionTemplate',$event)"></table-panel>
    </el-col>
  </el-row>
  <el-dialog title="意见模板信息" width="40%" :visible.sync="opinionTemplateDlgVisible">
    <el-form ref="opinionTemplateForm" :model="opinionTemplateRecord" :rules="opinionTemplateRules"
    label-position="right" label-width="100px" size="mini" status-icon>
      <el-form-item label="所属学院" prop="xybh">
        <el-select v-model="opinionTemplateRecord.xybh" placeholder="请选择学院" filterable>
          <template v-for="item in facultyData">
            <el-option :key="item.xybh" :label="item.xymc" :value="item.xybh">
              <span style="float: left">{{ item.xymc }}</span>
              <span style="float: right; font-size: 13px; margin-left:5px;">{{ item.xybhzdy }}</span>
            </el-option>
          </template>
        </el-select>
      </el-form-item>
      <el-form-item label="模板类型" prop="mblx">
        <el-input v-model="opinionTemplateRecord.mblx"></el-input>
      </el-form-item>
      <el-form-item label="模板内容" prop="mbnr">
        <el-input type="textarea" v-model="opinionTemplateRecord.mbnr"></el-input>
      </el-form-item>
      <el-checkbox v-model="opinionTemplateRecord.sfqy" label="是否启用" true-label="1" false-label="0">
      </el-checkbox>
      <el-row>
        <el-button @click="onConfirm('opinionTemplate', $event)" type="primary" size="mini">确定</el-button>
        <el-button @click="opinionTemplateDlgVisible=false" size="mini">取消</el-button>
      </el-row>
    </el-form>
  </el-dialog> 
</div>
  
</template>
<script>
import TablePanel from "@/components/basic/TablePanel";
import {
  formModelInitFromTable,
  formRulesInitFromTable
} from "@/utils/formutils.js";
import { trueFalseRenderer } from "@/utils/tableutils.js";


//meta info
var opinionTemplate = "opinionTemplate"; // 表格名称
var columnsAttr = "Columns"; // 列
var dataAttr = "Data"; // 数据
var selectionAttr = "Selection"; // 选中
var dlgVisibleAttr = "DlgVisible"; // 对话框
var formAttr = "Form";
var recordAttr = "Record"; // 表单模型
var rulesAttr = "Rules"; // 表单验证
var curPageAttr = "CurrentPage";// 分页-当前页
var totalNumAttr = "TotalNum";// 分页-总数
var qParamAttr = "QueryParams";// 查询参数

// 系信息-列
var opinionTemplateColumns = [
  {
    prop: "xybh",
    label: "学院编号",
    outOfSearch:true,
    hidden: true,
    rules: [{
      required: true,
      message:"请选择学院",
      trigger: "blur"
    }]
  },
  {
    prop:"xymc",
    label:"所属学院"
  },
  {
    prop: "yjmbbh",
    label: "意见模板编号",
    outOfSearch:true,
    hidden: true
  },
  {
    prop: "mblx",
    label: "模板类型",
    rules: [{
      required: true,
      message:"必填",
      trigger: "blur"
    },{ 
      max: 5, 
      message: "不超过5个字符", 
      trigger: 'blur' 
    }]
  },
  {
    prop: "mbnr",
    label: "模板内容",
    rules: [{
      required: true,
      message:"必填",
      trigger: "blur"
    },{ 
      max: 200, 
      message: "不超过200个字符", 
      trigger: 'blur' 
    }]
  },
  {
    prop: "sfqy",
    label: "是否启用",
    type: "boolean",
    width: 80,
    outOfSearch: true,
    align: "center",
    headerAlign: "center",
    renderer: trueFalseRenderer
  }
];

export default {
  name:"OpinionTemplate",
components: {
    "table-panel": TablePanel
  },
  methods: {
    onSearching: function(tname, params) {//查询
      var me = this;
      let url = "/jcYjmb";// /static/data/opinionTemplate.json

      if(url !== "") {
        me[tname+qParamAttr] = {};
        me[tname+qParamAttr] = params;
        if (params.isAccurate) {
          me[tname+qParamAttr] = params.paramPairs;
        } else {
          me[tname+qParamAttr].keywords = params.query;
        }
        me.getRequest(url, me[tname+qParamAttr]).then(resp => {
            if(resp.status == 200) {
              me[tname+dataAttr] = resp.data;
              // me[tname+totalNumAttr] = resp.data.total;
            }
        });
      }
    },
    onCreate: function(tname) {// 新增
      var me = this;
      me[tname + recordAttr] = formModelInitFromTable(me[tname + columnsAttr]);
      me[tname + recordAttr].sfqy = "1"; // 创建时，有效否是选中的
      
      me[tname + dlgVisibleAttr] = true;
    },
    onEdit: function(tname, row) {// 编辑
      var me = this;
      me[tname + recordAttr] = row;
      me[tname + dlgVisibleAttr] = true;
    },
    onDelete: function(tname, row) {// 删除
      var me = this;
      me.$confirm("确定删除这条记录吗?", "提示", {
          type: "warning"
        }).then(() => {
          me.deleteRequest(`/jcYjmb/${row.yjmbbh}`).then((resp)=>{
            if(resp.status == 200) {
              me.$message.success("删除成功!" + resp.data.msg);
              me.onSearching(opinionTemplate,{});// 重新加载表格数据
            }else{
              me.$message.error('删除失败！');
            }
          });
        }).catch(() => {});
    },
    onExport: function(tname, params) {// 导出
      var me = this;
      me.$message.info("发送导出请求，返回下载路径");
    },
    onSelectionChange: function(tname, data) {// 选中改变
      var me = this;
      // 缓存记录，按照角色编号，查询对应的选中权限节点数组
      me[tname + selectionAttr] = data;
    },
    onConfirm: function(tname) {// 对话框-确认
      var me = this;
      // 验证信息
      var ret;
      me.$refs[tname + formAttr].validate((result, what) => {
        ret = result;
      });
      if (!ret) {
        me.$message.error("表单信息有误");
        return;
      }
      // 发送请求 /static/data/testSuc.json
      me.postRequest("/jcYjmb",me[tname+recordAttr]).then(resp => {
        if (resp.status == 200) {
          me.$message.success("提交成功！");
          //最后，隐藏对话框
          me[tname + dlgVisibleAttr] = false;
          me.onSearching(opinionTemplate, {});// 重新查一遍
        } else {
          me.$message.error("服务器发生错误，代码：");
        }
      });
    },
    onPageChange:function(tname,page){// 分页改变
      var me = this;
      let url = "/jcYjmb";

      if(url !== ""){
        me[tname+curPageAttr] = page;
        me[tname+qParamAttr]["page"] = page;
        me.getRequest(url, me[tname+qParamAttr]).then(resp => {
            if(resp.status == 200) {
              me[tname+dataAttr] = resp.data;
              // me[tname+totalNumAttr] = resp.data.total;
            }
        });
      }

    }
  },
  data() {
    return {
      authorities:{
        create:true,
        delete:true,
        edit:true,
        search:true
      },// 权限控制
      [opinionTemplate + columnsAttr]: opinionTemplateColumns, // 表格-列
      [opinionTemplate + dataAttr]: [], // 表格的数据
      [opinionTemplate + selectionAttr]: [], // 当前选中
      [opinionTemplate + dlgVisibleAttr]: false, // 对话框是否可见
      [opinionTemplate + recordAttr]: {}, // 表单模型
      [opinionTemplate + rulesAttr]: {}, // 表单验证
      [opinionTemplate + curPageAttr]:1,// 当前页
      [opinionTemplate + totalNumAttr]:0,// 总数
      [opinionTemplate + qParamAttr]:{},// 查询参数
      pageSize:20,// 每页数量
      facultyData:[]
    };
  },
  created: function() {
    var me = this;
    // 添加权限控制
    // me.authorities = me.$route.meta.authorities;

    // 表单模型初始化
    me[opinionTemplate+recordAttr] = formModelInitFromTable(me[opinionTemplate+columnsAttr]);
    // 表单验证初始化
    me[opinionTemplate+rulesAttr] = formRulesInitFromTable(me[opinionTemplate+columnsAttr]);

    // 加载学院数据
    me.getRequest("/jcXyxxb",{}).then(resp=>{
      if(resp.status == 200) {
        me.facultyData = resp.data;
      }
    });
    
  }
}
</script>
<style lang="scss">

.module-basic-opiniontemplate{
  height:100%;
  
   
}
 
</style>


